<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
				*{
			padding: 0;
			margin: 0 auto;
			box-sizing: border-box;
			}
			#container
			{
				width: 1200px;
				height: auto;
				
			}
			#header
			{
				float: left;
				width: 100%;
			}
			#context
			{
				float: left;
				width: 100%;
				margin-top: 10px;
				margin-left: 60px;
				margin-right: 60px;
			}
			#logo
			{
				float: left;
				margin-top: 10px;
   				margin-left:70px;
			}
			#tab
			{
				margin-top: 40px;
				padding-left: 10px;
				margin-left: 10px;
				float: left;
			    color:#FFFFFF;
			    font-size: 18px;
			}
			#tab div {
			    position: relative;
			    width: 70px;
			    height: 30px;
			    border: 1px solid #cccccc;
			    text-align: center;
			    border-radius: 8%;
			    float: left;
			    margin-left: 10px;
			    background: aliceblue;
			 	border-bottom: 0px;
			}	
			#tab div  a{
			    position: absolute;
			    margin-top: 3px;
			    color: darkgreen;
			    right: 18px;
			    font-weight: bold;
			    color: #006400;
			}
			#operator
			{
				float: right;
				font-size: 15px;
				color: #495FAE;
				margin-top: 5px;
				margin-right: 70px;
			}
			#mune
			{
				float: left;
				width: 100%;
				color:#FFFFFF;
				background:#EE7700 ;
			}
			#mune a{
				margin-left: 15px;
				font-size: 15px
			}
			#left
			{
				float: left;
				width: 20%;
				
			}
			#right
			{
				float: left;
				width: 70%;
			}
			#left1{
				border: #D8D2CB 1px solid;
				margin-bottom: 10px;
			}
			#lt1
			{
				background: #FFF0D9;
				color: #B55620;
				font-size: 20px;
				font-weight:bold;
			}
			#lt1 a{
				margin-left: 5px;
			}
			#lt2
			{
				background: #FAFAFA;
				color: #000000;
				 font-weight:bold;
			}
			#lt2 a{
				margin-left: 6px;
			}
			#lt3{
				float: left;
			}
			li{
				list-style: none;
				font-size: 15px;
				margin-left: 15px;
				margin-bottom: 5px;
			}
			#mune2
			{
				float: left;
				width: 100%;
				color:#000000;
				background:#D8D2CB ;
			}
			#location{
				float: left;
				margin-left: 60px;
				margin-top: 10px;
				font-size: 15px;
			}
			#r2
			{
				float: left;
				width: 100%;
				margin: 10px;
				margin-bottom: 0px;
				
			}
			#r1{
				float: left;
				width: 100%;
				margin: 10px;
				margin-top: 0px;
			}
			#text1{
				background: #FAFAFA;
				padding: 5px;
				padding-left: 20px;
				font-weight: bold;
				color: #262626;
			}
			#text2{
				padding: 5px;
				padding-left: 20px;
				color: #CCCCCC;
			}
			#text3{
				padding: 5px;
				padding-left: 20px;
				color: #262626;
			}
			#r3{
				float: left;
				width: 100%;
				margin: 10px;
				margin-top: 30px;vertical-align: middle;
			}
			#r3 div{
				font-size: 20px;
				font-weight: bold;
				padding-left: 50px;
				padding-top: 12px;
				vertical-align: middle;
			}
			#r3 input{
				height: 34px;
				vertical-align: middle;
			}
		</style>
	</head>
	<body>
		<div id="container">
			<div id="header">
				<div id="logo"><a border="1"><img src="img/logo.gif" /></a></div>
				<div id="tab">
					<div style="float: left;background: #EE7700;"><a style="color:#F0F8FF;">首页</a></div>
			        <div style="float: left;"><a >图书</a></div> 
			        <div style="float: left;"><a>百货</a> </div>
			        <div style="float: left;"><a>品牌</a> </div>
			        <div style="float: left;"><a>促销</a></div>
				</div>
				<div id="operator">
					<span style="background: url(img/bg.png)0px -68px;">&nbsp;&nbsp;&nbsp;</span>
					<a href="shopping.html">购物车</a>
					<a href="login.html">登录</a>
					<a href="resiger.html">注册</a>
					<a href="guestbook.html">留言</a>
				</div>
			</div>
			<div id="mune">
				<a style="margin-left: 70px;">音乐</a>
				<a>影视</a>
				<a>少儿</a>
				<a>动漫</a>
				<a>小说</a>
				<a>外语</a>
				<a>数码照相机</a>
				<a>笔记本</a>
				<a>羽绒服</a>
				<a>秋冬靴</a>
				<a>运动鞋</a>
				<a>美容护肤</a>
				<a>家纺用品</a>
				<a>婴幼奶粉</a>
				<a>饰品</a>
				<a>Investor Redations</a>
			</div>
			<div id="location">您现在的位置是:<a style="color: #95A2D0;">易卖网</a>><a>在线留言</a></div>
			<div id="context">
				<div id="left">
					<div id="left1">
							<div id="lt1" ><a>商品分类</a></div>
					<div>
						<div id="lt2" ><a>图书影像</a></div>
						<ul>
							
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>图书</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>音乐</li>
						</ul>
					</div>
					<div >
						<div id="lt2"><a>百货</a></div>
						<ul>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>运动健康</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>服装</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>家具</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>美妆</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>母婴</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>食品</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>手机数码</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>家具首饰</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>手表饰品</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>鞋包</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>家电</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>电脑办公</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>玩具文具</li>
							<li><span style="background: url(img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>汽车饰品</li>
						</ul>
					</div>
					</div>
				</div>
				<div id="right">
					<div id="r2">
						<span style="background: url(img/bg.png)-235px -105px;">&nbsp;&nbsp;&nbsp;</span>
						<a>全部留言</a>
						<hr size="4" color="#EE7700">
					</div>
					<div id="r1">
						<div id="text1">那个什么衣服贵吗</div>
						<div id="text2">网友：张三丰　　2010:10:10 20:00:01</div>
						<div id="text3">不贵</div>
						<div id="text1">那个什么衣服贵吗</div>
						<div id="text2">网友：张三丰　　2010:10:10 20:00:01</div>
						<div id="text3">不贵</div>
						<div id="text1">那个什么衣服贵吗</div>
						<div id="text2">网友：张三丰　　2010:10:10 20:00:01</div>
						<div id="text3">不贵</div>
					</div>
					<div id="r3">
						<hr style="border:1px solid #CCCCCC;" />
						<div>　　昵称：　<input type="text" size="70"></div>
						<div>留言标题：　<input type="text" size="70"></div>
						<div>回复内容：　<textarea name="message" rows="7" cols="54"></textarea></div>
						<div>
							<button type="button" style="background: #495FAE;font-size: 15px;padding: 8px;color: #FAFAFA;margin-left: 16%;" >提交留言</button>
						</div>
					</div>
				</div>					
			</div>
			<div id="mune2">
				<a style="margin-left: 35%;">Copyright &copy; 2016 东方睿智 All Rights Reserved.京ICP证1000001号</a>
			</div>
		</div>
	
	</body>
</html>
